<template>
  <div id="app">
    <v-header :seller="seller"></v-header>
    <div class="tab border-1px">
	      <div class="tab-item">
	           <router-link to="/goods">商品</router-link>
	      </div>
	      <div class="tab-item">
	           <router-link to="/ratings">评论</router-link>
	      </div>
	      <div class="tab-item">
	           <router-link to="/seller">商家</router-link>
	      </div>
    </div>
    <keep-alive ><router-view :seller="seller"></router-view></keep-alive>
  </div>
</template>

<script>
import {urlParse} from './common/js/util';
import VHeader from './components/header/header'
const ERR_OK = 0;
export default {
  name: 'App',
  data () {
  	return {/* 商家默认有id   vue+localStorage+收藏+解析url参数实例解析*/
  		seller:{
  			/* 从地址栏中的url中通过urlParam函数解析，得到id */
  			id: (()=>{
  				let queryParam = urlParse();
  				//console.log(queryParam);
  				return queryParam.id;
  			})()
  		}
  	}
  },
  components:{
  	VHeader
  },
  created(){	
  	 // then(function(response){},function(){})两个参数，一个是成功回调，一个是失败回调
  	 let aurl = '/api/seller.json'
  	 //let aurl = '/api/seller?id=' + this.seller.id;
        this.$http.get(aurl).then((response) => {
        	response = response.body;
        	if (response.errno === ERR_OK) {
          		//this.seller = response.data; //这样取到的id是undefined
          		//console.log(this.seller); //拿到seller对象
          		this.seller = Object.assign({}, this.seller, response.data);
         		//console.log(this.seller.id);
         	}
       });
  }



}
</script>
<style lang="stylus" rel="stylesheet/stylus" scoped >
@import './common/stylus/mixin.styl'
	#app
		.tab
			display:flex
			width:100%
			height:40px
			line-height:40px
			// border-bottom: 1px solid rgba(7, 17, 27, 0.1)
			border-1px(rgba(7, 17, 27, 0.1))
			.tab-item
				flex:1
				text-align:center
				& > a
					display:block
					font-size:14px
					color:rgb(77,85,93)
					&.active
						color:rgb(240,20,20)
				
</style>
